<!--
 * @Description: 用户登录
 * @Author: rendc
 * @Date: 2021-09-09 11:22:59
 * @LastEditors: rendc
 * @LastEditTime: 2021-09-09 15:09:40
-->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>用户登录</title>
  <script src="https://cdn.bootcdn.net/ajax/libs/qs/6.10.1/qs.min.js"></script>
  <script src="./util.js"></script>
</head>

<body>
  用户名： <input type="text" id="username">
  <br>
  密码： <input type="text" id="password">
  <br>
  <button onclick="login()">登录</button>
  <br>
  <hr>
  <button onclick="findAllUser()">查询所有用户</button>
  <button onclick="findMenuByUserId(25)">查询用户权限</button>
  <hr>
  <div id="main"></div>
</body>
<script>
  function login() {
    var username = document.getElementById("username").value;
    var password = document.getElementById("password").value;
    // 新建一个httpRequest对象 xhr
    var httpRequest = new XMLHttpRequest();
    // 打开连接
    httpRequest.open("post", "http://203.195.246.58:8888/user/login");
    // 配置post请求的数据格式
    httpRequest.setRequestHeader("Content-Type", "application/json");
    // 传递参数
    var obj = {
      username: username,
      password: password,
    }
    var jsonObj = JSON.stringify(obj);
    // 发起请求 
    httpRequest.send(jsonObj);
    // 处理响应
    httpRequest.onreadystatechange = function () {
      if (httpRequest.readyState === 4 && httpRequest.status === 200) {
        // 获取响应的数据
        var res = httpRequest.responseText;
        var resObj = JSON.parse(res);
        console.log(resObj);
        if (resObj.status === 200) {
          console.log("登录成功");
          var token = resObj.data.token;
          // 把token储存到浏览器中的session
          sessionStorage.setItem("token", token);
        } else {
          alert(resObj.message);
        }
      }
      // 失败的处理
      // if (condition) {

      // }
    }
  }

  function findAllUser() {
    // 创建一个请求对象
    var httpRequest = new XMLHttpRequest();
    // 打开http连接
    httpRequest.open("get", "http://203.195.246.58:8888/baseUser/findAll")
    // 获取token
    var token = sessionStorage.getItem("token")
    if (token) {
      // 配置token
      httpRequest.setRequestHeader("Authorization", token);
      // 发起请求
      httpRequest.send();
      // 处理响应
      httpRequest.onreadystatechange = function () {
        if (httpRequest.readyState === 4 && httpRequest.status === 200) {
          var res = httpRequest.responseText;
          document.getElementById("main").innerHTML = res;
        }
      }
    } else {
      alert("请重新登录");
    }
  }

  // 使用封装的ajax
  // http://203.195.246.58:8888
  // /baseUser/findMenuByUserId
  // ?id=25
  function findMenuByUserId(id) {
    myAjax.get(
      '/baseUser/findMenuByUserId', {
        id: id
      },
      function (res) {
        console.log("查询成功");
        console.log(res);
        document.getElementById("main").innerHTML = res.data;
      },
      function (err) {
        console.log("请求失败");
        console.log(err);
      }
    )
  }
</script>

</html>